import Taro from '@tarojs/taro-rn';
import * as tslib_1 from "tslib";
import React from 'react';
import { Component } from "@tarojs/taro-rn";
import { View, Form, Input, Button, Text } from "@tarojs/components-rn";
import { observer, inject } from "@tarojs/mobx-rn";
import set_phoneStyleSheet from "./set_phone_styles";

import { getRuntime, phoneNumPartOf } from "../../utils/common";
var _styleSheet = set_phoneStyleSheet;
let Register_step_one = class Register_step_one extends Component {
  constructor() {
    super(...arguments);
    this.state = {
      phoneNumber: '',
      password: '',
      smsCode: '',
      focus: 'phoneNumber',
      isComplete: true
    };
  }
  componentWillMount() {
    Taro.setNavigationBarTitle({ title: '修改手机号' });
  }
  handelRouter(url = '/pages/index/index') {
    getRuntime().navigateTo(url);
  }
  // 获取验证码
  getSmsCode() {
    const { stores: { userStore } } = this.props;
    if (getRuntime().isEmpty(this.state.phoneNumber)) {
      getRuntime().showToast('请填写手机号~');
      return;
    }
    userStore.getSmsCode({
      form: {
        phoneNumber: this.state.phoneNumber,
        checkDay: 15
      }, callback: () => {}
    });
  }
  formSubmit() {
    const { stores: { userStore } } = this.props;
    userStore.registerStepOneF({
      form: {
        sourceUserId: 0,
        phoneNumber: "string",
        password: "string",
        smsCode: "string"
      },
      callback: () => {
        // console.log(res)
      }
    });
  }
  // input聚焦
  inputFocus(type = 'phoneNumber') {
    this.setState({
      focus: type
    });
  }
  inputPhoneNumberChange(e) {
    this.setState({
      phoneNumber: e.target.value
    }, () => {
      if (this.state.phoneNumber.length > 0 && this.state.smsCode.length > 0) {
        this.setState({
          isComplete: false
        });
      }
    });
  }
  inputSmsCodeChange(e) {
    this.setState({
      smsCode: e.target.value
    }, () => {
      if (this.state.phoneNumber.length > 0 && this.state.smsCode.length > 0) {
        this.setState({
          isComplete: false
        });
      }
    });
  }
  render() {
    let { focus, isComplete } = this.state;
    let { userInfo } = this.props.stores.userStore;
    return <View style={[_styleSheet["login-wrap"], _styleSheet["set-phone"]]}>

         <View style={_styleSheet["old"]}>
           <View>当前手机号</View>
           <View style={_styleSheet["list-desc"]}>{phoneNumPartOf(userInfo.phoneNumber)}</View>
         </View>
         <Form onSubmit={this.formSubmit}>

           <View style={_styleSheet["input-group"]}>
             <Text style={_styleSheet["input-title"]}>新手机号</Text>
             <Input type="number" name="phoneNumber" placeholderClass="placeholder-class" placeholder="请输入11位手机号" maxLenght="11" style={_styleSheet["input"]} />
           </View>
           <View style={_styleSheet["input-group"]}>
             <Text style={_styleSheet["input-title"]}>验证码</Text>
             <Input type="text" name="smsCode" placeholderClass="placeholder-class" placeholder="请输入验证码" onFocus={this.inputFocus.bind(this, 'smsCode')} onChange={this.inputSmsCodeChange.bind(this)} style={_styleSheet["input"]} />
             <View onClick={this.getSmsCode.bind(this)} style={_styleSheet["get-code"]}>获取验证码</View>
           </View>

           <Button type="primary" onClick={this.handelRouter.bind(this, '/pages/login/register_step_two')} style={[_styleSheet["btn-submit"], _styleSheet["btn-submit-on"]]}>确认更改</Button>
         </Form>
       </View>;
  }
};
Register_step_one = tslib_1.__decorate([inject("stores"), observer], Register_step_one);
export default Register_step_one;